.uix-step {
  vertical-align: top;
  position: relative;
  display: inline-block; }
  .uix-step .step-sm-vertical {
    width: 100px; }
  .uix-step .step-md-vertical {
    width: 150px; }
  .uix-step .step-lg-vertical {
    width: 200px; }
  .uix-step .step-sm-horizontal {
    height: 50px; }
  .uix-step .step-md-horizontal {
    height: 70px; }
  .uix-step .step-lg-horizontal {
    height: 90px; }
  .uix-step .step-head .step-icon {
    width: 40px;
    border-radius: 50%;
    line-height: 40px;
    text-align: center;
    color: white; }
  .uix-step .step-head .step-icon-icon {
    font-size: 35px; }
  .uix-step .step-head .step-wait {
    background: #DDDDDD; }
  .uix-step .step-head .step-process {
    background: #20A0FF; }
  .uix-step .step-head .step-error {
    background: red; }
  .uix-step .step-head .step-finish {
    background: #13CE66; }
  .uix-step .step-head-horizontal .step-icon {
    display: block; }
  .uix-step .step-head-horizontal .step-line-sm {
    height: 60%; }
  .uix-step .step-head-horizontal .step-line-md {
    height: 60%; }
  .uix-step .step-head-horizontal .step-line-lg {
    height: 60%; }
  .uix-step .step-head-horizontal .step-line {
    display: inline-block;
    width: 2px;
    text-align: center;
    position: absolute;
    left: 19px; }
  .uix-step .step-head-vertical .step-icon {
    display: inline-block; }
  .uix-step .step-head-vertical .step-line-sm {
    width: 65%; }
  .uix-step .step-head-vertical .step-line-md {
    width: 76.66667%; }
  .uix-step .step-head-vertical .step-line-lg {
    width: 82.5%; }
  .uix-step .step-head-vertical .step-line {
    display: inline-block;
    height: 2px;
    line-height: 40px;
    position: absolute;
    top: 19px; }
  .uix-step .step-content-vertical {
    display: inline-block;
    width: 60px;
    text-align: center; }
    .uix-step .step-content-vertical .step-title {
      display: inline-block;
      margin-top: 10px;
      margin-left: -10px;
      font-weight: bold;
      font-size: 16px; }
    .uix-step .step-content-vertical .step-desc {
      display: inline-block;
      margin-top: 5px;
      font-size: 12px;
      margin-left: -10px; }
    .uix-step .step-content-vertical .step-wait-color {
      color: #DDDDDD; }
    .uix-step .step-content-vertical .step-process-color {
      color: #20A0FF; }
    .uix-step .step-content-vertical .step-finish-color {
      color: #13CE66; }
    .uix-step .step-content-vertical .step-error-color {
      color: red; }
  .uix-step .step-content-horizontal {
    display: inline-block;
    position: absolute;
    left: 50px;
    top: 0px;
    width: 60px;
    margin-left: 20px; }
    .uix-step .step-content-horizontal .step-title {
      display: inline-block;
      margin-top: 10px;
      margin-left: -10px;
      font-weight: bold;
      font-size: 16px; }
    .uix-step .step-content-horizontal .step-desc {
      display: inline-block;
      margin-top: 5px;
      font-size: 12px;
      margin-left: -10px; }
    .uix-step .step-content-horizontal .step-wait-color {
      color: #DDDDDD; }
    .uix-step .step-content-horizontal .step-process-color {
      color: #20A0FF; }
    .uix-step .step-content-horizontal .step-finish-color {
      color: #13CE66; }
    .uix-step .step-content-horizontal .step-error-color {
      color: red; }

.uixstep:last-child .step-line {
  display: none; }
